<template>
<div>
  <h1>添加数据</h1>
  <p><input type="text" v-model="form.name"></p>
  <p><input type="text" v-model="form.age"></p>
  <button @click="add">提交</button>
  {{list}}

  <h1>添加2数据</h1>
  <p>姓名：<input type="text" v-model="form2.name"></p>
<!--  <p>性别：<input type="radio" v-model="form2.sex" value="1">男-->
<!--        <input type="radio" v-model="form2.sex" value="0">女-->
<!--  </p>-->
  <p>时间:<input type="datetime-local" v-model="form2.add_time"></p>
  <p>内容：<textarea name="" id="" cols="30" rows="10" v-model="form2.content"></textarea></p>
  <p>浮点：<input type="text" v-model="form2.score"></p>
  <button @click="add_user">提交</button>

{{list2}}

  <h1>添加数据3</h1>
  <p>姓名<input type="text" v-model="form3.name"></p>

  <p>年龄<input type="text" v-model="form3.age"></p>
  <button @click="add_stu">提交</button>
  <table>
    <tr>
      <td>姓名</td>
      <td>年龄</td>
      <td>年龄</td>
    </tr>
    <tr v-for="i in list3">
      <td>{{i.name}}</td>
      <td>{{i.age}}</td>
      <td>
        <button @click="put_3(i.id)">修改</button>
        <button @click="del(i.id)">删除</button>
      </td>
    </tr>
  </table>
  {{list3}}


</div>
</template>

<script>
export default {
  name: "add_all",
  data(){
    return{
      form:{},
      list:[],
      form2:{},
      list2:[],
      form3:{},
      list3:[]
    }
  },
  methods:{
    add(){
      this.$axios.post('http://127.0.0.1:5000/add',this.form)
      .then(i=>{
        this.show()
      })

    },
    show(){
      this.$axios.get('http://127.0.0.1:5000/add').then(i=>{
        this.list = i.data.list
      })
    },
    add_user(){
      this.$axios.post('http://127.0.0.1:5000/user',this.form2).then(i=>{
      })
    },
    show_user(){
      this.$axios.get('http://127.0.0.1:5000/user').then(i=>{
        this.list2 = i.data.list
      })
    },
    add_stu(){
      this.$axios.post('http://127.0.0.1:5000/stu',this.form3)
      .then(i=>{
        if (i.data.code ==200){
          alert("添加成功")
          this.show_stu()
        }
      })
    },
    show_stu(){
      this.$axios.get('http://127.0.0.1:5000/stu')
      .then(i=>{
        this.list3 = i.data.list
      })
    },
    put_3(id){
      this.$router.push({path:'/put_stu',query:{id:id}})
    },
    del(id){
      this.$axios.delete('http://127.0.0.1:5000/stu?id='+id)
      .then(i=>{
        this.show_stu()
      })
    }

  },
  mounted() {
    this.show()
    this.show_user()
    this.show_stu()
  }
}
</script>

<style scoped>

</style>
